package com.wuyan.warriorsoffate.ui.view

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.ExperimentalAnimationApi
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.AlertDialog
import androidx.compose.material.Button
import androidx.compose.material.Icon
import androidx.compose.material.Text
import androidx.compose.runtime.*
import androidx.compose.runtime.snapshots.SnapshotStateList
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.unit.dp
import com.wuyan.warriorsoffate.R
import com.wuyan.warriorsoffate.ui.theme.WeTheme

//搜索框
@ExperimentalAnimationApi
@Composable
fun WeSearch(onSearch:(String)->Boolean,valueChange:(value:String)->Unit={},modifier: Modifier=Modifier){
    val search= remember {
        mutableStateOf("")
    }
    val isError= remember {
        mutableStateOf(false)
    }
    if (isError.value){
        AlertDialog(onDismissRequest = {
            isError.value=false
        }, title = {
            Text(text = "错误")
        }, text = {
            Text(text = "查找失败："+search.value)
        }, confirmButton = {
            Button(onClick = {
                isError.value=false
            }) {
                Text(text = "关闭")
            }
        })
    }
    Row(modifier = modifier
        .wrapContentHeight()
        .background(WeTheme.colors.text, shape = CircleShape)
        .padding(start = WeTheme.weDp.paddingSmall, end = WeTheme.weDp.paddingSmall), verticalAlignment = Alignment.CenterVertically) {
        TextFieldBase(value = search.value, onValueChange = {
            valueChange(search.value)
            search.value=it.replace("\n","")
        }, modifier = Modifier
            .padding(start = WeTheme.weDp.marginMedium)
            .wrapContentHeight()
            .weight(1.0f, false), keyboardOptions = KeyboardOptions(imeAction = ImeAction.Search)
            ,keyboardActions = KeyboardActions (
                onSearch ={
                    if (search.value.isNotEmpty()){
                        if(!onSearch(search.value)){
                            isError.value=true
                        }
                    }
                }
            ))
        AnimatedVisibility(visible = search.value.isNotEmpty()){
            Icon(painter = painterResource(id = R.drawable.clear), contentDescription = "取消输入框类容",
                modifier = Modifier
                    .size(WeTheme.weDp.iconDp.div(1.5f))
                    .clickable {
                        search.value = ""
                        valueChange("")
                    },
                tint = WeTheme.colors.onText)
        }
        Box(modifier = Modifier
            .padding(WeTheme.weDp.marginMedium)
            .height(26.dp)
            .width(1.dp)
            .background(WeTheme.colors.onText))
        Icon(painter = painterResource(id = R.drawable.search),
            contentDescription = "搜索武将", modifier = Modifier
                .size(WeTheme.weDp.iconDp)
                .clickable {
                    if (search.value.isNotEmpty()) {
                        if (!onSearch(search.value)) {
                            isError.value = true
                        }
                    }
                },
            tint = WeTheme.colors.onText)
    }
}

@ExperimentalAnimationApi
@Composable
fun <T> WeSearchHasList(data:SnapshotStateList<T>,onSearch:(value:String)->Unit, onSelect:(value:Int)->Unit, modifier: Modifier=Modifier){
    var pos=0
    Row(
        modifier,
        verticalAlignment = Alignment.CenterVertically) {
        AnimatedVisibility(visible = data.size>1, modifier = Modifier.size(40.dp)) {
            Column(modifier = Modifier.size(WeTheme.weDp.iconDp)) {
                Icon(painter = painterResource(id = R.drawable.top),
                    contentDescription = "上一个", tint = WeTheme.colors.text,
                    modifier = Modifier
                        .clickable {
                            if (pos > 0) {
                                --pos
                            } else {
                                pos = data.size - 1
                            }
                            onSelect(pos)
                        }
                        .fillMaxWidth()
                        .weight(0.5f))
                Icon(painter = painterResource(id = R.drawable.bottom),
                    contentDescription = "下一个", tint = WeTheme.colors.text,
                    modifier = Modifier
                        .clickable {
                            if (pos == data.size - 1) {
                                pos = 0
                            } else {
                                ++pos
                            }
                            onSelect(pos)
                        }
                        .fillMaxWidth()
                        .weight(0.5f))
            }
        }
        WeSearch(onSearch = {
            data.clear()
            onSearch(it)
            data.isNotEmpty()
        }, valueChange = {data.clear()})
    }
}